<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<title>功能维护</title>
<jsp:include page="include.jsp" />
<script type="text/javascript">


	/**
	 *加载树
	 */
	$(function(){
		 $("#treeId").tree({
             	url: 'treeAjax.form?pid=0',
             	onBeforeExpand:function(node,param){ 
                 	$('#treeId').tree('options').url = "treeAjax.form?pid=" + node.id;// change the url
             	},
             	onClick:function(node){
					$('#ftree').form('load','treeIdAttributeAjax.form?id='+node.id);
				}
         });
		 cancel();
	});
	/**
	*新建
	*/
	function news(){
		var node = $('#treeId').tree('getSelected');
		if (node){
			if (node.attributes.leafage==1){
				$.messager.alert('提示', "不能在功能下添加功能");
				return;
			}
			$('#w').window('open');
		} else {
			$.messager.alert('提示', "没有选择功能");
		}
	}
	/**
	*关闭窗口
	*/
	function cancel(){
		$('#w').window('close');
	}
	/**
	*保存
	*/
	function save(){
		var name = $('#wname').val();
		if (name==''){
			$.messager.alert('提示', "名称不能为空间");
			return ;
		}
		var node = $('#treeId').tree('getSelected');
		var leafage = $('#wleafage').val();
		var url = $('#wurl').val();
		var classname = $('#wclassname').val();
		var description = $('#wdescription').val();
		if (leafage=='0'){
			url = '';
			classname = '';
		}
		$.ajax({
			  type: 'POST',
			  url: 'treeSaveAjax.form',
			  data: 'pid='+node.id+'&name='+name+'&leafage='+leafage+'&url='+url+'&classname='+classname+'&description='+description,
			  success: function(json){
				  if (json){
					  $('#w').window('close');
					  $("#treeId").tree('append', {parent:node.target, data:json});
					  $('#wform').form('clear');//清空表单
				  } else {
					  $.messager.alert('提示', '保存错误'); 
				  }
			  }, 
			  error : function (text){
				  $.messager.alert('提示', '保存错误'); 
			  },
			  dataType: 'json'
		});
	}
	/**
	*删除
	*/
	function deleteTree(){
		var node = $('#treeId').tree('getSelected');
		var children = $('#treeId').tree('getChildren', node.target);
		if (children.length>0){
			$.messager.alert('提示', '先把子功能删除在删除在删除'); 
			return;
		}
		$.ajax({
			  type: 'POST',
			  url: 'treeDeleteAjax.form',
			  data: 'id='+node.id,
			  success: function(text){
				  $.messager.alert('提示', text);
				  $('#w').window('close'); //关闭窗口
				  $('#treeId').tree('remove', node.target);
				  
			  },
			  error : function (text){
				  $.messager.alert('提示', '删除错误'); 
			  },
			  dataType: 'text'
		});
	}

</script>
</head>

	
<body class="easyui-layout">  
    <div region="west"  title="功能" style="width:200px;">
    			<ul id="treeId"></ul>
    </div>  
    <div region="center"  title="功能属性" style="padding:5px;">
    	<div style="background:#fafafa;padding:10px;width:500px;height:300px;">
		    <form id="ftree" method="post">
		        <div>
		            <label>序号:</label>
		            <input class="easyui-validatebox" type="text" name="id" required="true" disabled="disabled"></input>
		        </div>
		        <div>
		            <label>名称:</label>
		            <input class="easyui-validatebox" type="text" name="name" required="true"></input>
		        </div>
		        <div>
		            <label>功能:</label>
		            <select name="leafage" class="easyui-validatebox">
		            	<option value="1">功能</option>
						<option value="0">功能树</option>
		            </select>
		        </div>
		        <div>
		            <label>地址:</label>
		            <input class="easyui-validatebox" type="text" name="url" style="width:300px;"></input>
		        </div>
		        <div>
		            <label>类名:</label>
		            <input class="easyui-validatebox" type="text" name="classname" style="width: 400px;"></input>
		        </div>
		        <div>
			        <label>描述:</label>
			        <textarea name="description" style="height:18px;"></textarea>
			    </div>
		    </form>
    	</div>
    </div>
    
    <div region="south" style="height:50px; padding: 10px">
   		<div style="text-align:center;">
   			<input type="button" value="增    加" onclick="news()">
   			<input type="button" value="删    除" onclick="deleteTree()">
   			<input type="button" value="修   改" onclick="">
   		</div>
	</div>


<!-- 窗口 -->
<div id="w" class="easyui-window" title="新建" iconCls="icon-save" style="width:500px;height:350px;padding:5px;">
	<div class="easyui-layout" fit="true">
		<div region="center" border="false" style="padding:10px;background:#fff;border:1px solid #ccc;">
			<form id="wform" method="post">
		        <div>
		            <label>名称:</label>
		            <input class="easyui-validatebox" type="text" name="wname" id="wname"></input>
		        </div>
		        <div>
		            <label>功能:</label>
		            <select name="wleafage" class="easyui-validatebox" id="wleafage">
		            	<option value="1">功能</option>
						<option value="0">功能树</option>
		            </select>
		        </div>
		        <div>
		            <label>地址:</label>
		            <input class="easyui-validatebox" type="text" name="wurl" id="wurl"></input>
		        </div>
		        <div>
		            <label>类名:</label>
		            <input class="easyui-validatebox" type="text" name="wclassname" style="width: 400px;" id="wclassname"></input>
		        </div>
		        <div>
			        <label>描述:</label>
			        <textarea name="wdescription" style="height:80px;" id="wdescription"></textarea>
			    </div>
			</form>
		</div>
		<div region="south" border="false" style="text-align:right;height:30px;line-height:30px;">
			<a class="easyui-linkbutton" iconCls="icon-ok" href="javascript:void(0)" onclick="save()">确定</a>
			<a class="easyui-linkbutton" iconCls="icon-cancel" href="javascript:void(0)" onclick="cancel()">取消</a>
		</div>
	</div>
</div>
</body>
</html>